import { defineConfig } from "vite"
import vue from "@vitejs/plugin-vue"
import { resolve } from "path"
//引入插件
import AutoImport from "unplugin-auto-import/vite" //自动引入ref,reactive等等等
import postcsspxtoviewport from "postcss-px-to-viewport"

export default defineConfig({
  // base: './',   // 在生产中服务时的基本公共路径
  // publicDir: resolve(__dirname, "./dist"), //默认'public'  作为静态资源服务的文件夹  (打包public文件夹会没有，里面得东西会直接编译在dist文件下)
  // assetsInclude: resolve(__dirname, "./src/assets"), // 静态资源处理
  plugins: [
    vue(),
    AutoImport({
      imports: ["vue", "vue-router"]
      // dts: 'types/auto-import.d.js' //生成全局引入的文件
    })
  ],
  server: {
    // https: true, //(使用https)启用 TLS + HTTP/2。注意：当 server.proxy 选项 也被使用时，将会仅使用 TLS
    host: true, // 监听所有地址
    port: 8000, //指定开发服务器端口：默认3000
    // open: true, //启动时自动在浏览器中打开
    // cors: false, //为开发服务器配置 CORS
    // headers: '', //指定服务器响应的 header
    proxy: {
      //配置自定义代理规则
      "/hospital": {
        target: "http://172.29.217.56:10080",
        changeOrigin: true, //是否跨域
        rewrite: (path) => path.replace(/^\/hospital/, "")
      },
      "/smarthome": {
        target: "http://172.29.217.55:10010",
        changeOrigin: true, //是否跨域
        rewrite: (path) => path.replace(/^\/smarthome/, "")
      },
      "/devices": {
        target: "http://172.29.217.55:10001",
        changeOrigin: true, //是否跨域
        rewrite: (path) => path.replace(/^\/devices/, "")
      },
      "/robot": {
        target: "http://172.29.217.55:10082",
        changeOrigin: true, //是否跨域
        rewrite: (path) => path.replace(/^\/robot/, "")
      },
      // 视频的代理
      "/video": {
        target: "http://172.29.217.55:10002",
        changeOrigin: true, //是否跨域
        rewrite: (path) => path.replace(/^\/video/, "")
      },
      // ws配置
      "/smarthome_ws": {
        target: "172.29.217.55:10081",
        ws: true
      }
    },
    hmr: {
      // 禁用或配置 HMR 连接
      overlay: false //可以禁用开发服务器错误的屏蔽。
    }
  },
  build: {
    // target: 'modules', //设置最终构建的浏览器兼容目标  //es2015(编译成es5) | modules
    outDir: "dist", // 构建得包名  默认：dist
    assetsDir: "image" // 静态资源得存放路径文件名  assets
    // assetsInlineLimit: '4096', // 小于此阈值的导入或引用资源将内联为base64编码，设置为0可禁用此项。默认4096（4kb）
    // cssCodeSplit: true, // 启用/禁用CSS代码拆分，如果禁用，整个项目的所有CSS将被提取到一个CSS文件中,默认true
    // sourcemap: false, //构建后是否生成 source map 文件
    // brotliSize: false, // 启用/禁用 brotli 压缩大小报告。 禁用该功能可能会提高大型项目的构建性能
    // minify: 'esbuild', // 混淆器，项目压缩 :boolean | 'terser' | 'esbuild';terser构建后文件体积更小
    // write: true,   //设置为 false 来禁用将构建后的文件写入磁盘
    // emptyOutDir: true,  //默认情况下，若 outDir 在 root 目录下，则 Vite 会在构建时清空该目录。
    // brotliSize: true,  //启用/禁用 brotli 压缩大小报告
    // chunkSizeWarningLimit: 1000, //chunk 大小警告的限制（以 kbs 为单位）默认：500
    // cssTarget: 'chrome61', //防止 vite 将 rgba() 颜色转化为 #RGBA 十六进制符号的形式  (要兼容的场景是安卓微信中的 webview 时,它不支持 CSS 中的 #RGBA 十六进制颜色符号)
    // rollupOptions: {
    //   output: {
    //     entryFileNames: '[name].[hash].js', // 入口文件名格式
    //     chunkFileNames: 'chunks/[name].[hash].js', // 代码分割后的文件名
    //     assetFileNames: 'assets/[name].[hash][extname]', // 静态资源文件名
    //     format: 'esm', // 输出格式（esm/cjs/iife/umd）
    //   },
    //   external: ['echarts', 'axios'] //打包时排除的依赖
    //   treeshake: true, //默认情况下，启用此选项以利用 tree-shaking 优化删除未使用的代码
    // },
    // terserOptions: {
    //   compress: {
    //     drop_console: true,
    //     drop_debugger: true,
    //   },
    // }, //去除 console debugger
  },
  resolve: {
    extensions: [".js", ".json", ".vue"],
    alias: {
      "@": resolve(__dirname, "src"),
      "/images": "src/assets/images/"
    }
  },
  // 引入第三方的配置,强制预构建插件包
  optimizeDeps: {
    include: ["echarts", "axios"]
  },
  css: {
    // 全局变量+全局引入less+配置antdv主题色
    preprocessorOptions: {
      less: {
        javascriptEnabled: true
        // charset: false, // 关闭编译时 字符编码 报错问题
        // 全局变量使用：@primary-color
        // modifyVars: {
        //   'primary-color': '#1890ff', // 全局主色
        //   'link-color': ' #1890ff', // 链接色
        //   'success-color': ' #52c41a', // 成功色
        //   'warning-color': ' #faad14', // 警告色
        //   'error-color': ' #f5222d', // 错误色
        //   'font-size-base': ' 14px', // 主字号
        //   'heading-color': ' rgba(0, 0, 0, 0.85)', // 标题色
        //   'text-color': ' rgba(0, 0, 0, 0.65)', // 主文本色
        //   'text-color-secondary': ' rgba(0, 0, 0, 0.45)', // 次文本色
        //   'disabled-color': ' rgba(0, 0, 0, 0.25)', // 失效色
        //   'border-radius-base': ' 2px', // 组件/浮层圆角
        //   'border-color-base': ' #d9d9d9', // 边框色
        //   'box-shadow-base': ' 0 2px 8px rgba(0, 0, 0, 0.15)' // 浮层阴影
        // }
      }
    }
    // postcss: {
    //   plugins: [
    //     postcsspxtoviewport({
    //       unitToConvert: "px", // 要转化的单位
    //       viewportWidth: 1080, // UI设计稿的宽度
    //       unitPrecision: 6, // 转换后的精度，即小数点位数
    //       propList: ["*"], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换
    //       viewportUnit: "vh", // 指定需要转换成的视窗单位，默认vw
    //       fontViewportUnit: "vh", // 指定字体需要转换成的视窗单位，默认vw
    //       selectorBlackList: ["ignore-"], // 指定不转换为视窗单位的类名，
    //       minPixelValue: 1, // 默认值1，小于或等于1px则不进行转换
    //       mediaQuery: true, // 是否在媒体查询的css代码中也进行转换，默认false
    //       replace: true, // 是否转换后直接更换属性值
    //       exclude: [/node_modules/], // 设置忽略文件，用正则做目录名匹配
    //       landscape: false, // 是否处理横屏情况
    //     }),
    //   ],
    // },
  }
})
